<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-08-05 15:16:04
 * @LastEditTime : 2019-12-27 17:18:23
 * @LastEditors  : Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <script type="text/javascript" src="../script/jquery.js"></script>
    <script type="text/javascript" src="../script/vue.min.js"></script>
    <script type="text/javascript" src="../script/vant.min.js"></script>
    <script type="text/javascript" src="../script/fastclick.js"></script>
    <script type="text/javascript" src="../script/base.js"></script>
    <style type="text/css">
        .row {
            margin-top: 10px
        }

        .row:last-child {
            margin-bottom: 10px;
        }

        .ov {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 14px;
        }

        /* .van-cell__value {
             text-align: right;
         } */

        .label {
            font-weight: 500;
            font-size: 13px;
            color: #969799;
        }

        .rrr td {
            color: #cd1b21;
            font-weight: 700;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="init-full">
            <van-nav-bar class="head" :title="title + '('+ searchData.CEDate +')'" left-arrow @click-left="onClickLeft">
                <div slot="right" class="head-right">
                    <span @click="intoPrint">
                        <img src="../image/print.png" />
                    </span>
                    <span @click="showSearch = true;">
                        <img src="../image/search.png" />
                    </span>
                </div>
            </van-nav-bar>
            <div class="body-no-bottom">
                <div class="content">
                    <div class="report">
                        <div class="table-full">
                            <table style="width: 100%;">
                                <tr>
                                    <th>单据日期</th>
                                    <th>单据名称</th>
                                    <th>单据编号</th>
                                    <th>金额</th>
                                    <th>累计</th>
                                </tr>
                                <tr v-for="(row,index) in dataList"
                                    :class="(row.BillName == '上期结余' || row.BillName == '本期结余')?'rrr':''">
                                    <td class="td_center">{{row.BDate}}</td>
                                    <td class="td_center">{{row.BillName}}</td>
                                    <td class="td_center" @click="intoSelling(row)"><span
                                            style="color: #409eff;font-size: 12px;">{{row.Billno}}</span></td>
                                    <td class="td_right">{{row.DMoney}}</td>
                                    <td class="td_right">{{row.LMoney}}</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
                <van-loading v-if="showLoading" />
            </div>
            <div class="bottom">
                <div class="bottom-left-label" style="padding: 5px 10px;" v-if="totalData">
                    <!-- <div style="float: left;width: 33.33%;">
                        <span>上期结余</span></br>
                        <span class="number">￥{{totalData.ARQ_Mon}}</span>
                    </div>
                    <div style="float: left;width: 33.33%;">
                        <span>本期发生</span></br>
                        <span class="number">￥{{totalData.ARB_Mon}}</span>
                    </div>
                    <div style="float: left;width: 33.33%;">
                        <span>本期结余</span></br>
                        <span class="number">￥{{totalData.ARE_Mon}}</span>
                    </div> -->
                    <span>本期发生：</span>
                    <span class="number">￥{{totalData.ARB_Mon}}</span>


                </div>
                <!-- <div class="bottom-right-button"></div> -->
            </div>
        </div>

        <van-popup v-model="showSearch" round position="bottom">
            <div>
                <van-cell title="分支机构" :value="searchData.BranchName" @click="openScreen(-1,99)" is-link>
                </van-cell>
                <van-cell title="账期" :value="searchData.CEDate" @click="openDate(2)" is-link>
                </van-cell>
            </div>
            <div class="btn-padding">
                <van-button type="primary" block style="border-radius: 0;" @click="searchList">查询</van-button>
            </div>
        </van-popup>


        <van-popup v-model="showDate" round position="bottom">
            <van-datetime-picker v-model="currentDate" type="year-month" @confirm="confirmDate" @cancel="cancelDate"
                cancel-button-text="清空" />
        </van-popup>
    </div>
</body>

<script type="text/javascript">
    var vm;
    apiready = function () {
        //$('.init-full').show();

        api.addEventListener({
            name: 'selectRow'
        }, function (ret, err) {
            var selectType = ret.value.selectType;
            var type = ret.value.type;
            var row = ret.value.row;
            if (selectType == 99) {
                vm.searchData.BranchName = row.name;
                vm.searchData.BranchID = row.id;

            }
        });

        var userInfo = FLD.getUserInfo();
        var dateIndex = 0;
        vm = new Vue({
            el: '#app',
            data: {
                showLoading: false,
                ifConfirm: false,
                showSearch: false,
                title: api.pageParam.titleName,
                currentDate: new Date(),
                showDate: false,
                searchData: {
                    ClientID: api.pageParam.ClientID,
                    BranchID: api.pageParam.BranchID || 0,
                    BranchName: api.pageParam.BranchName || '',
                    CSDate: '',
                    CEDate: FLD.getFormatYearMonthTime()
                },
                dataList: [],
                totalData: ''

            },
            created: function () {
                var that = this;
                if (!that.searchData.BranchID) {
                    that.showSearch = true;
                } else {
                    that.getList();
                }

                // this.getTotalData();
            },
            methods: {
                openScreen(type, index) {
                    var obj = {
                        S_Type: index,
                        S_Cont: '',
                        S_BranchID: FLD.getUserInfo().S_BranchID,
                        S_SXZ: '',
                        S_StockID: FLD.getUserInfo().S_StockID,
                        S_CargoID: FLD.getUserInfo().S_CargoID,
                        S_BarCode: '',
                        S_PriceN: 0,
                        S_ProductID: 0
                    }

                    api.openWin({
                        name: '筛选' + index,
                        url: 'common/baseScreen.html',
                        reload: true,
                        slidBackEnabled: false,
                        pageParam: {
                            filterData: obj,
                            type: type,
                            allowClear: false
                        }
                    })

                },
                getList() {
                    var that = this;
                    that.showLoading = true;
                    var days = new Date(that.searchData.CEDate.split('-')[0], that.searchData.CEDate.split('-')[1], 0).getDate();

                    var obj1 = {
                        CClientID: that.searchData.ClientID,
                        CBranchID: that.searchData.BranchID,
                        CClientTree: '',
                        CSDate: that.searchData.CEDate + '-01',
                        CEDate: that.searchData.CEDate + '-' + days
                    }
                    FLD.ajax('App_ClientYSRpt', obj1, function (res) {
                        // alert(JSON.stringify(res))
                        if (res.ds2.length) {
                            that.totalData = res.ds2[0];
                            // alert(JSON.stringify(that.totalData))

                            var obj2 = {
                                ClientID: that.searchData.ClientID,
                                BranchID: that.searchData.BranchID,
                                CSDate: that.searchData.CEDate + '-01',
                                CEDate: that.searchData.CEDate + '-' + days
                            }
                            FLD.ajax('App_ClientYSJYRpt', obj2, function (res) {
                                // alert(JSON.stringify(res))
                                that.showLoading = false;
                                if (that.totalData) {
                                    var data = res.ds2.unshift({
                                        BDate: '',
                                        BillName: '上期结余',
                                        Billno: '',
                                        DMoney: '',
                                        LMoney: that.totalData.ARQ_Mon
                                    })
                                }

                                for (var i in res.ds2) {
                                    if (that.totalData) {
                                        if (i > 0) {
                                            res.ds2[i].LMoney = res.ds2[i - 1].LMoney + res.ds2[i].DMoney;
                                        }
                                    } else {
                                        if (i > 0) {
                                            res.ds2[i].LMoney = (res.ds2[i - 1].LMoney || 0) + res.ds2[i].DMoney;
                                        } else {
                                            res.ds2[i].LMoney = res.ds2[i].DMoney;
                                        }
                                    }


                                }
                                if (that.totalData) {
                                    res.ds2.push({
                                        BDate: '',
                                        BillName: '本期结余',
                                        Billno: '',
                                        DMoney: '',
                                        LMoney: that.totalData.ARE_Mon
                                    })
                                }

                                that.dataList = res.ds2;
                                console.log(JSON.stringify(that.dataList))

                            })

                        } else {
                            that.showLoading = false;
                            that.totalData = '';
                            that.dataList = [];
                        }



                    })


                },
                getTotalData() {
                    var that = this;
                    var days = new Date(that.searchData.CEDate.split('-')[0], that.searchData.CEDate.split('-')[1], 0).getDate()
                    var obj = {
                        CClientID: that.searchData.ClientID,
                        CBranchID: that.searchData.BranchID,
                        CClientTree: '',
                        CSDate: that.searchData.CEDate + '-01',
                        CEDate: that.searchData.CEDate + '-' + days
                    }
                    FLD.ajax('App_ClientYSRpt', obj, function (res) {
                        if (res.ds2.length) {
                            that.totalData = res.ds2[0];
                        } else {
                            that.totalData = '';
                        }
                    })
                },
                getTotal() {
                    var that = this;
                    var t = 0;
                    for (var i in that.dataList) {
                        t += that.dataList[i].BMoney
                    }
                    return t;
                },
                searchList() {
                    var that = this;
                    that.showSearch = false;

                    this.getList();
                    // this.getTotalData();
                },
                openDate(index) {
                    var that = this;
                    dateIndex = index;
                    this.currentDate = new Date(that.searchData.CEDate + '-01')
                    this.showDate = true;
                },
                confirmDate(value) {
                    if (dateIndex == 1) {
                        this.searchData.CSDate = FLD.getFormatDate(value).split(' ')[0]
                    } else {
                        this.searchData.CEDate = FLD.getFormatYearMonthTime(value);
                    }
                    this.showDate = false;
                },
                cancelDate(value) {
                    if (dateIndex == 1) {
                        this.searchData.CSDate = '';
                    } else {
                        this.searchData.CEDate = '';
                    }
                    this.showDate = false;
                },
                intoSelling(row) {
                    var that = this;
                    if (row.BillName == '销售出库单') {
                        api.openWin({
                            name: 'selling1',
                            url: 'selling1.html',
                            reload: true,
                            slidBackEnabled: false,
                            pageParam: {
                                historyData: {
                                    BillNO: row.Billno,
                                    BillType: 101,
                                    ClientID: FLD.getUserInfo().S_ClientID,
                                    ClientName: FLD.getUserInfo().S_ClientName,
                                    BranchID: FLD.getUserInfo().S_BranchID,
                                    BranchName: FLD.getUserInfo().S_BranchName,
                                    BillID: row.keyValue
                                },
                                d: true
                            }
                        })

                    }
                },
                intoPrint() {
                    var that = this;
                    var nodeArray = [];
                    for (var i in that.dataList) {
                        nodeArray.push({
                            '单据日期': that.dataList[i].BDate,
                            '单据名称': that.dataList[i].BillName,
                            '单据编号': that.dataList[i].Billno,
                            '金额': that.dataList[i].DMoney,
                            '累计': that.dataList[i].LMoney
                        })
                    }
                    var printData = {
                        title: '福路德汽配连锁',
                        subtitle: '往来对账单',
                        top: {
                            '往来单位': api.pageParam.ClientName,
                            '账期': that.searchData.CEDate
                        },
                        node: nodeArray,
                        center: {
                            '本期发生': that.totalData.ARB_Mon
                        }
                    }
                    window.localStorage.setItem('printData', JSON.stringify(printData));
                    api.openWin({
                        name: '打印预览',
                        url: 'common/printPreview1.html',
                        reload: true,
                        slidBackEnabled: false
                    })

                },
                onClickLeft() {
                    api.closeWin();
                }
            }
        })
    };
</script>

</html>